<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>ECharts</title>
  <script src="./echarts.min.js"></script>
  <script src=" ./jquery.min.js"></script>

</head>

<body>

  <div id="main" style="width: 600px;height:400px;"></div>
  <script type="text/javascript">

    var myChart = echarts.init(document.getElementById('main'));
    // var chartDom = document.getElementById('main');
    // var myChart = echarts.init(chartDom);

    var option;

    // myChart.showLoading();
    $.getJSON(
      './guanxi.json',
      function (json) {
        // myChart.hideLoading();//加载的缓存
        myChart.setOption(
          (option = {
            title: {
              text: '大数据2032'
            },

            series: [
              {
                type: 'graph',//类型
                layout: 'none',
                //数据节点的遍历
                data: json.nodes.map(function (node) {
                  return {
                    x: node.x,
                    y: node.y,
                    id: node.id,
                    name: node.label,
                    symbolSize: node.size,
                    itemStyle: {
                      color: node.color
                    }
                  };
                }),

                //数据关系的遍历

                edges: json.edges.map(function (edge) {
                  return {
                    source: edge.sourceID,
                    target: edge.targetID
                  };
                }),










                // 高亮的图形样式和标签样式


                emphasis: {
                 
                    label: {
                        show: true,
                        position: 'right',


                    },
                    focus: 'adjacency',
  
                },
                roam: true,
                lineStyle: {
                    width: 0.5,
                    curveness: 0.3,
                    opacity: 0.7
                }
              }
            ]
          }),
          true
        );
      }
    );

  </script>
</body>

</html>